<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>Main menubar basic tests</title>

	<!-- CUSTOMIZATION: Make sure "../" URLs for href/src attributes are correct -->
	<link rel="stylesheet" type="text/css" href="../css/testplan.css" />
</head>

<body>
	<div class="navbar">
		<a href="./" title="show directory contents"><code>./</code> (show contents of this directory)</a>
		&nbsp;&nbsp;&nbsp;&nbsp;
		<a href="../" title="show directory contents"><code>../</code> (show contents of parent directory)</a>
	</div>
	<hr />
	<h1 class="test_title">Main menubar basic tests</h1>
	<p class="automatedTestCase">
	Note: instead of running this test suite manually you can use the automated seleniumIDE test suite - 
	test/seleniumIdeTestCases/mainMenuOverview/main menu test suite</p>

	<h2 class="test_section">Create menu: create desktop application - default filename, default options, no save</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>Standard setup things: Clear the browser cache. Launch the Maqetta server. 
				Login if necessary. 
				In some cases, you'll want to setup a virgin user environment by creating a whole new user login.</li>
		<li>From the Create menu on the banner, choose "Desktop Application..."</li>
		<li>Click Create to accept the default file name (file1.html)</li>
		<li>Drag/drop any widget onto canvas</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>After clicking OK on file dialog, editor window appears with a blank canvas, and...</li>
		<li>Files palette should show the file name for this file, and...</li>
		<li>Widget palette is populated with many widgets organized into categories (e.g., Form, Layout, etc), and...</li>
		<li>Outline palette contains a single entry (e.g., ./file1.html), and...</li>
		<li>Property palette appear but entries are disabled until a widget is selected, and...</li>
		<li>After closing, the file name should be removed from the Files palette.</li>
	</ol>

	<h2 class="test_section">Create menu: create desktop application - default filename, with save</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Create menu on the banner, choose "Desktop Application..."</li>
		<li>Click Create to accept the default file name (file1.html)</li>
		<li>Drag/drop any widget onto canvas</li>
		<li>Click the "Save" button on editor toolbar</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
		<li>Double-click on the filename in Files palette to reopen</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>After clicking Create on file dialog, ...(same as above)...</li>
		<li>After clicking save, dirty indicator (*) should disappear from editor's tab.</li>
		<li>(With 0.6, there is a known bug with dirty logic where you are prompted "are you sure" even though no changes since last save)</li>
		<li>After closing, the file name should continue to be visible in Files palette.</li>
		<li>After reopening, the visual page editor should show the widget you added to the page.</li>
	</ol>

	<h2 class="test_section">Create menu: create desktop application - different filename in root directory, with save</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Create menu on the banner, choose "Desktop Application..."</li>
		<li>Don't accept the default filename. Instead, type a new file name, but within the default directory.</li>
		<li>Drag/drop any widget onto canvas</li>
		<li>Click the "Save" button on editor toolbar</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
		<li>Double-click on the filename in Files palette to reopen</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>Same as above, except with a different filename.</li>
	</ol>

	<h2 class="test_section">Create menu: create desktop application - nested directory, with save</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Create menu on the banner, choose "Folder..."</li>
		<li>Type a name for the new folder or accept the default name. Keep the current parent folder as ".".</li>
		<li>Highlight the new folder name in the Files palette.</li>
		<li>From the Create menu on the banner, choose "Desktop Application...:</li>
		<li>You should see your folder name listed as "parent folder". Enter a filename and click OK.</li>
		<li>Drag a button widget onto the canvas.</li>
		<li>Click the "Save" button on editor toolbar</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
		<li>Double-click on the filename in Files palette to reopen</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>A new editor window should appear (as with previous test sections).</li>
		<li>In the Files palette, the new file should appear as a nested file within the folder you just created..</li>
		<li>The button should be properly styled using the default theme (which in most cases is Claro, which results in bluish styling)</li>
	</ol>

	<h2 class="test_section">Create menu: Create CSS File - different filename in root directory, with save</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Create menu on the banner, choose "CSS File..."</li>
		<li>Don't accept the default filename. Instead, type a new file name, but within the default directory.</li>
		<li>Add some text to the file, such as ".foo { color:red; }"</li>
		<li>Click the "Save" button on editor toolbar</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
		<li>Double-click on the filename in Files palette to reopen</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>The new CSS file should be visible in the Files palette and upon reopening show the content you entered.</li>
	</ol>

	<h2 class="test_section">Create menu: Create JavaScript File - different filename in root directory, with save</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Create menu on the banner, choose "JavaScript File..."</li>
		<li>Don't accept the default filename. Instead, type a new file name, but within the default directory.</li>
		<li>Add some text to the file, such as "// a comment"</li>
		<li>Click the "Save" button on editor toolbar</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
		<li>Double-click on the filename in Files palette to reopen</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>The new JavaScript file should be visible in the Files palette and upon reopening show the content you entered.</li>
	</ol>

<!-- FIXME: Maybe restore this if we get Save/SaveAs buttons in toolbar for generic Create File source editing. See #43
	<h2 class="test_section">Create menu: Create File - in root directory, with save</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Create menu on the banner, choose "File..."</li>
		<li>Type a new file name, such as "a.txt", within the default directory.</li>
		<li>Add some text to the file, such as "some text"</li>
		<li>Click the "Save" button on editor toolbar</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
		<li>Double-click on the filename in Files palette to reopen</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>The new file should be visible in the Files palette and upon reopening show the content you entered.</li>
	</ol>
-->

	<h2 class="test_section">Create menu: Create theme </h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Create menu on the banner, choose "Theme..."</li>
		<li>Select "claro" and enter a new theme name, such as "mytheme1", and click OK</li>
		<li>Look under <code>themes/</code> folder in Files palette and look for a folder with the name you have provided.</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>The theme editor should open.</li>
		<li>There should be a new folder <code>themes/mytheme1/</code>, inside of which should be many CSS files and files mytheme1.json and mytheme1.theme.</li>
	</ol>

	<h2 class="test_section">Create menu: Create review </h2>
	<p>(Review and commenting testing is provided elsewhere)</p>

	<h2 class="test_section">Open menu: File...</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Open menu on the banner, choose "File..."</li>
		<li>From the file dialog that appears, select the "Sample1.html" file in the root folder and click "OK".</li>
		<li>Close the editor by clicking "x" on editor's tab</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>After clicking OK in the Open File dialog, Sample1.html should have appear in the visual editor.</li>
	</ol>

	<h2 class="test_section">Open menu: Theme Editor...</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Open menu on the banner, choose "Theme Editor..."</li>
		<li>In dialog that appears, choose the theme you created earlier (e.g., mytheme1).</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>After issuing the Open Theme Editor command, the theme editor should have appeared,
			showing a collection of Dojo widgets, and...</li>
		<li>Properties palette should have content, and...</li>
		<li>States palette should show a list of widget states, such as Normal, Selected, and Hover, and...</li>
		<li>Widgets and Outline palettes should be empty</li>
	</ol>

	<h2 class="test_section">Settings Menu: Preferences</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Settings menu on the banner, choose Preferences...</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>As of now, there should be two menu items on the Settings menu, Preferences... and Theme sets...</li>
		<li>Preferences dialog should appear. There should be a tree widget on the left with
			two  major sections, Project and HTML. Inside of the HTML, there should be a
			single entry, Visual Editor. The Visual Editor section should show various options,
			including Snap to nearest widget (default:on) / 
			When dragging, show possible parents (default:off) / 
			Warn on CSS Override (default:on) / 
			z-index for sketch mode (default:900).</li>
			<li>(Note that there is a separate test plan for Theme sets...)</li>
	</ol>

	<h2 class="test_section">Help Menu</h2>
	<h3 class="steps_subsection">Steps</h3>
	<ol class="steps">
		<li>From the Help menu on the banner, select each of the menu items (Documentation, Tutorials, About Maqetta).</li>
	</ol>
	<h3 class="expectedResults_subsection">Expected results</h3>
	<ol class="expectedResults">
		<li>Documentation and Tutorials menu items should open a new browser tab showing the main Maqetta docs page and the tutorials subsection, respectively.</li>
		<li>About Maqetta should open a dialog displaying the version and build information.</li>
	</ol>

</body>
</html>
